---
title: "レンダリングモード"
i18nReady: true
---
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
import RecipeLinks from '~/components/RecipeLinks.astro';

Astroプロジェクトのコードをウェブ上に表示するには、HTMLへと**レンダリング**する必要があります。

Astroのページ、ルート、APIエンドポイントは、[ビルド時に事前レンダリング](#事前レンダリング)することも、[ルートがリクエストされたときにサーバーでオンデマンドにレンダリング](#オンデマンドレンダリング)することもできます。[Astroアイランド](/ja/concepts/islands/)により、必要に応じてクライアントサイドレンダリングも含められます。

Astroでは、処理の多くがブラウザではなくサーバーでおこなわれます。そのため、それほどパワフルでないデバイスやインターネット接続が遅い環境でサイトやアプリを表示したときに、クライアントサイドレンダリングよりも高速になります。サーバーでレンダリングされたHTMLは、高速でSEOにも優れており、デフォルトでアクセシブルです。

## サーバーの`output`モード

ページをレンダリングする方法は、[`output`](/ja/reference/configuration-reference/#output)で設定できます。

### 事前レンダリング

**デフォルトのレンダリングモードは __`output: 'static'`__ です**。これはビルド時にすべてのページルートのHTMLを作成します。

このモードでは、**サイト全体が事前レンダリングされ**、サーバーはすべてのページを事前にビルドしてブラウザに送信できるようにします。すべてのサイト訪問者に同じHTMLドキュメントが送信され、ページの内容を更新するにはサイト全体を再ビルドする必要があります。この方法は、**静的サイト生成（Static Site Generation、SSG）** としても知られています。

すべてのAstroプロジェクトはデフォルトで、最も軽量なブラウザ体験を提供するために、ビルド時に事前レンダリング（静的生成）するように設定されています。リクエストに応じてサーバーがページを生成する必要がないため、ブラウザがHTMLのビルドを待つ必要もありません。サイトはバックエンドのデータソースのパフォーマンスには依存せず、一度ビルドしてしまえば、サーバーが機能している限りは静的サイトとしてアクセス可能なままとなります。

静的サイトでは、インタラクティブなUIコンポーネントを使うために（あるいはクライアントサイドでレンダリングされるアプリ全体を埋め込むために！）、好みの[UIフレームワーク](/ja/guides/framework-components/)で作成した[Astroアイランド](/ja/concepts/islands/)を、静的に事前レンダリングされたページ内に含められます。

ページナビゲーションをまたいだアニメーションや状態の永続化のために、Astroの[ビュートランジションAPI](/ja/guides/view-transitions/)を`static`モードでも利用できます。静的サイトで[ミドルウェア](/ja/guides/middleware/)を使用して、リクエストに対するレスポンスデータをインターセプトして変換することもできます。

:::tip
更新頻度が低く、すべてのサイト訪問者に同じページコンテンツを表示するようなコンテンツ重視のサイトにとって、Astroのデフォルトの`static`モードは強力でモダンな選択肢となります。
:::

### オンデマンドレンダリング

Astroの他の2つの出力モードにより、**ページ、ルート、またはAPIエンドポイントの一部またはすべてをオンデマンドに都度レンダリング**するよう設定できます。
  - __`output: 'server'`__ は、多くのルートがオンデマンドであるような、高度に動的なサイトに適しています。
  - __`output: 'hybrid'`__ は、一部のルートがオンデマンドであるような、ほぼ静的なサイトに適しています。

これらのルートはアクセスごとに生成されるため、各ユーザーに合わせてカスタマイズできます。たとえば、オンデマンドにレンダリングされたページは、ログインしたユーザーにアカウント情報を表示したり、サイト全体を再ビルドすることなく最新のデータを表示したりできます。リクエスト時のサーバーでのオンデマンドレンダリングは、**サーバーサイドレンダリング（SSR）** とも呼ばれています。

以下が必要な場合は、Astroプロジェクトで[`server`または`hybrid`モードを有効にすることを検討](/ja/guides/server-side-rendering/#オンデマンドサーバーレンダリングを有効にする)してください。

- **APIエンドポイント**: 秘匿データをクライアントから隠蔽したまま、データベースアクセス、認証、認可などのタスクのために特定のページをAPIエンドポイントとして機能させます。

- **保護されたページ**: サーバーでユーザーアクセスを処理し、ユーザーの権限に基づいてページへのアクセスを制限します。

- **頻繁に変更されるコンテンツ**: サイトを静的に再ビルドすることなく個々のページを生成します。これは、ページのコンテンツが頻繁に更新される場合に便利です。たとえば、`fetch()`により動的に呼び出されるAPIから取得したデータを表示する場合などです。

`server`と`hybrid`いずれの出力モードにおいても、インタラクティブ性のために（あるいはクライアントサイドでレンダリングされるアプリ全体を埋め込むために！）、好みの[UIフレームワーク](/ja/guides/framework-components/)で作成した[Astroアイランド](/ja/concepts/islands/)を使用できます。アニメーションやルート間のナビゲーションをまたいだ状態の保持のために[ミドルウェア](/ja/guides/middleware/)やAstroの[ビュートランジションAPI](/ja/guides/view-transitions/)を使えば、高度にインタラクティブなアプリも作成できます。

:::tip
Astroのオンデマンドサーバーレンダリングは、クライアントサイドのシングルページアプリケーションによるJavaScriptのオーバーヘッドなしに、本物のアプリのような体験を提供します。
:::
